<template>
  <!-- 机票订单-侧边栏组件 -->
  <div class="aside">
    <div class="air-info">
      <el-row type="flex" justify="space-between" class="info-top">
        <div>{{data.dep_date}}</div>
        <div>{{data.org_city_name}}-{{data.dst_city_name}}</div>
      </el-row>
      <!-- 出发时间-达到时间 -->
      <el-row type="flex" justif="space-between" align="middle" class="info-step">
        <el-col :span="5" class="flight-airport">
          <strong>{{data.dep_time}}</strong>
          <span>{{data.org_airport_name}}{{data.org_airport_quay}}</span>
        </el-col>

        <el-col :span="14" class="flight-time">
          <span>---{{duration}}---</span>
          <span>{{data.airline_name}}{{data.flight_no}}</span>
        </el-col>
        <el-col :span="5" class="flight-airport">
          <strong>{{data.arr_time}}</strong>
          <span>{{data.dst_airport_name}},{{data.dst_airport_quay}}</span>
        </el-col>
      </el-row>
    </div>

    <!-- 金额部分 -->
    <el-row type="flex" justify="space-between" class="info-bar">
      <span>订单总价</span>
      <span>金额</span>
      <span>数量</span>
    </el-row>

    <el-row type="flex" justify="space-between" class="info-bar">
      <span>成人机票</span>
      <span v-if="data.seat_infos">￥ {{data.seat_infos.par_price}}</span>
      <span>x1</span>
    </el-row>

    <el-row type="flex" justify="space-between" class="info-bar">
      <span>机建 + 燃油</span>
      <span v-if="data.airport_tax_audlet">￥{{data.airport_tax_audlet}}/人/单程</span>
      <span>x1</span>
    </el-row>

    <el-row type="flex" justify="space-between" class="info-bar">
      <span>应付总额：</span>
      <span class="price" v-if="data.seat_infos">￥{{totalPrice}}</span>
    </el-row>
  </div>
</template>

<script>
export default {
  props: {
    data: {
      type: Object,
      defatult: {}
    },
    totalPrice: Number
  },
  computed: {
    //航班时长
    duration() {
      if (!this.data.dep_time) {
        return;
      }
      //将时间以：分割成数组
      //1.将出发时间和到达时间转化为分钟
      //2.两个时间相减之后转化为时-分的个数
      //出发时间
      let deptime = this.data.dep_time.split(":");
      //到达时间
      let arrtime = this.data.arr_time.split(":");
      //航班时长
      let time =
        Number(arrtime[0] * 60) +
        Number(arrtime[1]) -
        Number(deptime[0] * 60) -
        Number(deptime[1]);
      //如果达到时间为第二天
      if (time < 0) {
        time = time + 24 * 60;
      }
      return Math.floor(time / 60) + "小时" + (time % 60) + "分";
    }
  },
  created() {
    console.log("数据");
    console.log(this.data);
  },

  methods: {}
};
</script>

<style lang="less" scoped>
.aside {
  width: 350px;
  height: fit-content;
  border: 1px solid #ddd;
  .air-info {
    padding: 15px;
    .info-top {
      margin-bottom: 10px;
      > div:last-child {
        font-size: 14px;
      }
    }
    .info-step {
      .flight-airport {
        strong {
          display: block;
          font-size: 22px;
          font-weight: normal;
        }
        span {
          font-size: 12px;
          color: #999;
        }
      }
      .flight-time {
        text-align: center;
        font-size: 12px;
        color: #999;
        span {
          display: block;
        }
      }
      .flight-airport {
      }
    }
  }
  .info-bar {
    border-top: 1px dashed #ddd;
    padding: 10px 15px;
    font-size: 14px;
    color: #666;
    .price {
      font-size: 28px;
      color: orange;
    }
  }
}
</style>